<template>
	<view class="content">
		<view class="add-list clear-both">
			<view class="float-l fs16 color3 font-weight add-title">联系人</view>
			<view class="float-l fs16 color3 add-info clear-both">
				<input type="text" class="fs16 color3 add-info-t float-l add-info-input add-info-input2" placeholder="请填写姓名" placeholder-class="colorc9" v-model="addr.name" />
				<view class="float-r sex" :class="{ sexact: addr.gender == '先生' }" @tap="addr.gender = '先生'">先生</view>
				<view class="float-l sex sex1 " :class="{ sexact: addr.gender == '女士' }" @tap="addr.gender = '女士'">女士</view>
			</view>
		</view>
		<view class="add-list clear-both">
			<view class="float-l fs16 color3 font-weight add-title">手机号</view>
			<view class="float-l fs16 color3 add-info clear-both">
				<input
					type="text"
					class="fs16 color3 add-info-t float-l add-info-input add-info-t2"
					placeholder="请输入手机号码"
					placeholder-class="colorc9"
					v-model="addr.phone"
				/>
			</view>
		</view>

		<view class="add-list clear-both">
			<view class="float-l fs16 color3 font-weight add-title">所在城市</view>
			<view class="float-l fs16 color3 add-info">{{ addr.city }}</view>
		</view>
		<view class="add-list clear-both">
			<view class="float-l fs16 color3 font-weight add-title">收货地址</view>
			<view class="float-l fs16 color3 add-info clear-both" @tap="searchAddress">
				<view class="fs16 colorc9 add-info-t float-l text-over">{{ addr.AutoBuilding || addr.AddressAuto || '请点击选择' }}</view>
				<image src="../../../static/tabbar/index/enter.png" mode="aspectFill" class="add-info-img float-r"></image>
			</view>
		</view>
		<view class="add-list clear-both">
			<view class="float-l fs16 color3 font-weight add-title">门牌号</view>
			<view class="float-l fs16 color3 add-info clear-both">
				<input
					type="text"
					class="fs16 color3 add-info-t float-l add-info-input add-info-t2"
					placeholder="详细地址，例：12号楼3层301室"
					placeholder-class="colorc9"
					v-model="addr.HouseNumber"
				/>
			</view>
		</view>
		<!-- <view class="add-list2">
			<view class="fs16 color3 font-weight add-list2t">配送范围</view>
			<view class="fs13 color9">上海申嘉湖高速以北，绕城高速以南，外环高速以西，沈海 高速以东区域及嘉定行政区免费配送，超出区域按30元/个 收取运费，迪斯尼区域暂不支持配送。</view>
		</view> -->
		<view class="botm clear-both">
			<!-- <image src="http://iph.href.lu/40x40" mode="aspectFill" class="float-l botm-img"></image> -->
			<view class="float-l fs16 color3 font-weight">设为默认地址</view>
			<switch :checked="checked" @change="switchChecked()" style="transform:scale(0.7);margin-top: -.5vw;" class="float-l"/>
			<view class="fs14 colora float-r" @tap="del" v-show="addressid > 0">删除地址</view>
		</view>
		<view class="fs18 colorf font-weight text-center add-btn" @tap="save">保存地址</view>
	</view>
</template>

<script>
import { request } from '@/api/request/index.js';
import local_userinfo from '@/util/user/local-userinfo.js';
import local_addressinfo from '@/util/address/local_addr.js';

//用户缓存信息
let userSession = local_userinfo.getUserinfo();
export default {
	data() {
		return {
			checked:false,
			addressid: -1,
			addr: {
				id: -1,
				city: '上海',
				AddressAuto: '',
				AutoBuilding: '',
				HouseNumber: '',
				IsDefault: '',
				Lat: '',
				Lng: '',
				ShippingCost: '',
				address: '',
				area: '',
				name: '',
				phone: '',
				province: '',
				gender: '先生'
			},
			backurl: '',
			rewriteurl: '',
			updateOldaddress: false,
			addressSession: null,
			mapCallbackData: ''
		};
	},
	onLoad: function(options) {
		let id = options.id || null;
		this.backurl = options.backurl || '';
		if (id) {
			this.addressid = id;
		}
		this.getItem(id);
		
		// #ifdef MP-WEIXIN
		uni.hideShareMenu()
		// #endif
	},
	onShow:function(){
		let that =this;
		let mapcallData = this.$tempaddress.state;
		if (mapcallData && mapcallData.Lat) {
			that.addr.city= mapcallData.city
			that.addr.AddressAuto= mapcallData.AddressAuto
			that.addr.AutoBuilding= mapcallData.AutoBuilding
			that.addr.Lat= mapcallData.Lat
			that.addr.Lng= mapcallData.Lng
			that.addr.ShippingCost= 0
			that.addr.address= ''
			that.addr.area= mapcallData.area
			that.addr.province= mapcallData.province
			
			this.$tempaddress.commit('setTemp',{})
		}
	},
	methods: {
		setGlobalData(result) {
			this.addr={
				name: result.name||'',
				phone: result.phone||'',
				HouseNumber: result.HouseNumber||'',
				gender: result.gender||'先生',
				IsDefault: result.IsDefault||0,
				
				id:result.id || null,
				city: result.city,
				AddressAuto: result.AddressAuto,
				AutoBuilding: result.AutoBuilding,
				Lat: result.Lat,
				Lng: result.Lng,
				ShippingCost: 0,
				address: '',
				area: result.area,
				province: result.province
			}
			this.checked = result.IsDefault||0
		},
		getItem(id) {
			let that = this;
			let sessionKey = userSession ? userSession.sessionid : '';
			let city = '上海';
			let localAddress = local_addressinfo.getAddr();
			if(!id){//新增
				let _result = {
					city: localAddress.city,
					AddressAuto: localAddress.details,
					AutoBuilding: localAddress.title,
					Lat: localAddress.lat,
					Lng: localAddress.lng,
					ShippingCost: 0,
					address: '',
					area: localAddress.district,
					province: localAddress.province
				}
				this.setGlobalData(_result)
				return;
			}
			uni.showLoading({
				title: '正在加载模块...',
				mask: true
			});
			request
				.get({
					data: {
						city: city,
						rediskey: sessionKey,
						showtype: '',
						c: 'AddressController',
						m: 'Get',
						addressId: that.addressid
					}
				})
				.then(res => {
					if (res.Status == 'ok') {
						let result = res.Tag;

						let _result2 = {
							id: that.addressid,
							city: result.city || city,
							AddressAuto: result.AddressAuto || '',
							AutoBuilding: result.AutoBuilding || '',
							HouseNumber: result.HouseNumber || '',
							IsDefault: result.IsDefault || 0,
							Lat: result.Lat || '',
							Lng: result.Lng || '',
							address: result.address || '',
							area: result.area || '',
							name: result.name || '',
							phone: result.phone || '',
							province: result.province || '',
							gender: result.gender ? result.gender : '先生'
						};
						that.setGlobalData(_result2);
					} else {
						uni.showModal({
							title: res.Msg,
							showCancel: false
						});
					}
				})
				.catch(error => {
					console.error(error);
				});
		},
		searchAddress() {
			uni.navigateTo({
				url: '/pages/searchaddress/searchaddress'
			});
		},
		del() {
			let that = this;
			let go = () => {
				let userSession = local_userinfo.getUserinfo();
				let sessionKey = userSession ? userSession.sessionid : '';
				let city = '上海';
				uni.showLoading({
					title: '正在加载模块...',
					mask: true
				});
				request
					.get({
						data: {
							city: city,
							rediskey: sessionKey,
							showtype: '',
							c: 'AddressController',
							m: 'Del',
							addressId: that.addr.id
						}
					})
					.then(res => {
						if (res.Status == 'ok') {
							let pages = getCurrentPages();
							if(!pages || pages.length<=1 ){
								uni.switchTab({
									url:"/pages/address/address-list/address-list"
								})
								return ;
							}
							uni.navigateBack()
						} else {
							uni.showModal({
								title: res.Msg,
								showCancel: false
							});
						}
					})
					.catch(error => {
						console.error(error);
					});
			};

			uni.showModal({
				title: '提示',
				content: '是否删除此地址？',
				success: res => {
					if (res.confirm) go();
				}
			});
		},
		save() {
			let that = this;

			let userSession = local_userinfo.getUserinfo();
			that.addr.name = trim(that.addr.name);
			that.addr.phone = trim(that.addr.phone);
			that.addr.HouseNumber = trim(that.addr.HouseNumber);
			if (!that.addr.name)
				return uni.showToast({
					title: '请选择收货人信息',
					icon: 'none'
				});
			if (!/^1[3456789]\d{9}$/.test(that.addr.phone))
				return uni.showToast({
					title: '请输入收货人手机号',
					icon: 'none'
				});
			if (!that.addr.AddressAuto)
				return uni.showToast({
					title: '请选择配送地址',
					icon: 'none'
				});
			if (!trim(that.addr.HouseNumber))
				return uni.showToast({
					title: '请输入门牌号（例：12号楼3层301室）',
					icon: 'none'
				});
			let address = that.addr.AddressAuto + that.addr.HouseNumber + `(${that.addr.AutoBuilding})`;
			that.addr.address = address;
			that.addr.IsDefault = that.addr.IsDefault?1:0;
			that.addr.city=that.addr.city.replace(/市/, '');
			let params = {
				c: 'AddressController',
				m: that.addr.id ? 'Update' : 'Add',
				rediskey: userSession.sessionid,
				city: '上海',
				addressinfo: JSON.stringify(that.addr),
				addressId: that.addr.id
			};
			uni.showLoading({
				mask: true,
				title: '请稍等...'
			});
			request
				.post({
					data: params,
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					}
				})
				.then(res => {
					if (res.Status == 'ok') {
						let pages = getCurrentPages();
						if(!pages || pages.length<=1 ){
							uni.switchTab({
								url:"/pages/address/address-list/address-list"
							})
							return ;
						}
						uni.navigateBack()
					} else {
						uni.showModal({
							title: res.Msg,
							showCancel: false
						});
					}
				})
				.catch(error => {
					console.error(error);
				});
		},
		switchChecked(){
			this.addr.IsDefault=!this.addr.IsDefault;
			this.checked = this.addr.IsDefault
		}
	}
};

function trim(str) {
	return str.replace(/(^\s*)|(\s*$)/g, '');
}
</script>

<style lang="scss">
.content {
	padding-bottom: 13.8667vw;

	.add-list {
		border-bottom: 2upx solid #f2f2f2;
		margin: 0 4.2667vw;
		height: 13.8667vw;
		line-height: 13.8667vw;

		.add-title {
			height: 100%;
			width: 17.1vw;
			white-space: nowrap;
		}

		.add-info {
			width: 70vw;
			margin-left: 3.7334vw;
			height: 100%;

			.add-info-t {
				width: 62vw;
			}

			.add-info-t2 {
				width: 70vw;
			}

			.add-info-img {
				width: 5.8667vw;
				height: 5.8667vw;
				margin-top: 4vw;
			}

			.add-info-input {
				height: 5.8667vw;
				margin-top: 4vw;
			}

			.add-info-input2 {
				width: 21.334vw;
			}

			.sex {
				height: 7.4667vw;
				width: 18.667vw;
				text-align: center;
				line-height: 7.4667vw;
				color: #bcbcbc;
				border: 2upx solid #e8e8e8;
				border-radius: 1.0667vw;
				margin-top: 3.2vw;
			}

			.sex1 {
				margin-left: 7.5vw;
			}

			.sexact {
				color: #00449f;
				border: 2upx solid #00449f;
			}
		}
	}

	.add-list2 {
		border-bottom: 2upx solid #f2f2f2;
		margin: 0 4.2667vw;
		padding: 4.2667vw 0 3.7334vw 0;

		.add-list2t {
			margin-bottom: 1.8667vw;
		}
	}

	.botm {
		height: 5.8867vw;
		line-height: 5.8867vw;
		margin: 0 4.2667vw;
		margin-top: 5.1vw;

		.botm-img {
			width: 5.8667vw;
			height: 5.8667vw;
			display: block;
			margin-right: 1.2vw;
		}
	}

	.add-btn {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 9999;
		height: 13.8667vw;
		line-height: 13.8667vw;
		background: #00449f;
	}
}
</style>
